<template>
	<view>
		<Navbar :backUrl="'mine'"></Navbar>
		<view class="u-m-30">
			<view class="u-flex">
				<u-image width="120" height="120" shape="circle"
					:src="userInfo.head_img"
					mode="" />
				<view class="u-m-l-30 u-flex-1 u-flex u-row-between">
					<view class="u-flex-1">
						<view class="u-flex u-flex-1 u-m-t-10">
							<view class="u-font-bold u-font-34 u-m-r-10">{{ userInfo.name }}</view>
							<view class="u-m-r-10" v-if="userInfo.is_authentication == 2">
								<u-icon size="32" color="#FB6316" name="renzheng" custom-prefix="custom-icon" />
							</view>
							<view class="u-m-r-10" v-if="userInfo.is_company_user == 1">
								<u-icon size="32" name="qiye1" color="#F8494D" custom-prefix="custom-icon" />
							</view>
							<view class="u-tag-box u-m-r-10 role_tag_one" v-if="userInfo.center_status == 5">青创分汇</view>
							<view class="u-tag-box role_tag_one u-m-r-10" v-if="userInfo.holder.is_center == 1">城市分公司</view>
						</view>
						<view>
							<view class="u-m-t-10 u-font-bold">
								<span>当前业绩：</span>
								<span>{{userInfo.holder.center_performance}}元</span>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 权益 -->
			<view class="u-m-t-30 u-p-t-20 u-p-b-20 u-p-l-30 u-p-r-30 u-radius-20 u-back-light"
				@click="goViewAgreement">
				<view class="u-flex u-row-between">
					<view class="u-flex-1 u-flex">
						<u-image src="https://lrcj.oss-cn-shenzhen.aliyuncs.com/images/common/20241028398180471220.png"
							width="80" height="90"></u-image>
						<view class="u-m-l-20">
							<view class="u-font-bold u-font-30">青创分汇权益</view>
						</view>
					</view>
					<view class="u-flex u-back-puce u-color-white view_box u-p-t-10 u-p-b-10">
						<view>立即查看 ></view>
					</view>
				</view>
			</view>
			<!-- 邀请注册 -->
			<view class="u-m-t-30 u-p-t-20 u-p-b-20 u-p-l-30 u-p-r-30 u-radius-20 u-back-light"
				@click="goInviteList">
				<view class="u-flex u-row-between">
					<view class="u-flex-1 u-flex">
						<u-image src="https://lrcj.oss-cn-shenzhen.aliyuncs.com/images/common/20241028398180471220.png"
							width="80" height="90"></u-image>
						<view class="u-m-l-20">
							<view class="u-font-bold u-font-30">邀请青创分汇</view>
						</view>
					</view>
					<view class="u-flex u-back-puce u-color-white view_box u-p-t-10 u-p-b-10">
						<view>立即邀请 ></view>
					</view>
				</view>
			</view>
			<!-- 业绩 -->
			<view class="u-m-t-30 u-p-t-20 u-p-b-20 u-p-l-30 u-p-r-30 u-radius-20 u-back-light"
				@click="goPerformanceList">
				<view class="u-flex u-row-between">
					<view class="u-font-bold u-font-30">当前业绩</view>
					<view class="u-font-bold u-font-38 u-p-t-10 u-p-b-10">{{userInfo.holder.center_performance}}元</view>
				</view>
			</view>
			<!-- 学院 -->
			<view class="u-back-white u-m-t-30 u-p-t-30 u-p-b-30 u-p-l-20 u-p-r-20 u-radius-20"
				v-if="collegeList && collegeList[0]">
				<view class="u-flex u-row-between u-p-b-30 u-line-bottom">
					<view class="u-font-30 u-font-bold">青创分汇能量营</view>
					<view class="u-color-gray u-font-26" @click="goCollegeList">查看更多 ></view>
				</view>
				<view class="u-m-t-20 u-flex u-row-between u-col-top">
					<view style="width: 47%;" v-for="item in collegeList" :key="item.id"
						@click="goCollegeDetail(item.id)">
						<u-image width="100%" height="240rpx" border-radius="10" :src="item.img_wap" mode="aspectFill"></u-image>
						<view class="u-font-bold u-m-t-5">{{item.title}}</view>
					</view>
				</view>
			</view>
			<!-- 运营活动 -->
			<view class="u-back-white u-m-t-30 u-p-t-30 u-p-b-30 u-p-l-20 u-p-r-20 u-radius-20"
				v-if="costsList && costsList[0]">
				<view class="u-flex u-row-between u-p-b-30 u-line-bottom">
					<view class="u-font-30 u-font-bold">运营活动</view>
					<view class="u-color-gray u-font-26" @click="goCostsList">查看更多 ></view>
				</view>
				<view class="u-flex u-col-top u-m-t-20" v-for="item in costsList" :key="item.id" @click="goCostsDetail(item.id)">
					<view class="u-m-r-20" v-if="item.tpic">
						<u-image width="200rpx" height="140rpx" border-radius="10" :src="item.tpic"></u-image>
					</view>
					<view class="u-flex-1">
						<view class="u-font-30 u-font-bold u-text-line-15">{{item.title}}</view>
						<view class="u-flex u-color-gray u-m-t-10">
							<view>有效期</view>
							<view class="u-font-26 u-m-l-10">{{item.create_time}}</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import Navbar from '@/components/Navbar.vue'
	import {
		presidentInfo,
		userInfo
	} from '@/network/api.js'
	import {
		getActivityList
	} from '@/network/demand.js'
	import { teaCostsNesList } from '@/network/tea.js'
	export default {
		components: {
			Navbar
		},
		data() {
			return {
				user_id: uni.getStorageSync("user_id"),
				userInfo: {},
				collegeList: [], // 青创私董学院列表
				costsList: [], // 运营活动列表
			}
		},
		onLoad() {
			this.getPresidentInfo()
			this.getPresidentCollege()
			this.getCostsList()
		},
		mounted(){
			let _this = this
			uni.$on('update',function(){
				_this.getPresidentInfo()
			})
		},
		onUnload() {
			uni.$off('update')
		},
		methods: {
			async getPresidentInfo() {
				const res = await userInfo({ user_id: this.user_id})
				this.userInfo = res.data
			},
			getPresidentCollege() {
				const params = {
					page: 1,
					limit: 2,
					is_president: 7
				}
				getActivityList(params).then(res => {
					this.collegeList = res.data.list
				})
			},
			async getCostsList(){
				const params = {
					type_id: 3,
					page: 1,
					limit: 2
				}
				const res = await teaCostsNesList(params)
				this.costsList = res.data.list
			},
			goAddressList() {
				uni.navigateTo({
					url: "/pages/addressList/addressList"
				})
			},
			goCollegeList() {
				uni.navigateTo({
					url: "/operate/collegeList/collegeList"
				})
			},
			goPointShop(){
				uni.navigateTo({
					url: "/teaBureau/teaPointShop/teaPointShop"
				})
			},
			goCollegeDetail(id) {
				uni.navigateTo({
					url: "/pages/activityDetail/activityDetail?id=" + id + '&isBack=true'
				})
			},
			goInviteList() {
				uni.navigateTo({
					url: "/teaBureau/teaInviteList/teaInviteList"
				})
			},
			goRecordList(){
				uni.navigateTo({
					url: "/operate/recordList/recordList"
				})
			},
			goPaymentForm(){
				uni.navigateTo({
					url: "/operate/paymentForm/paymentForm?type=" + this.userInfo.info.accountValue
				})
			},
			goViewAgreement(){
				uni.navigateTo({
					url: '/operate/agreement/agreement?type=29'
				})
			},
			goCostsList(){
				uni.navigateTo({
					url: "/teaBureau/teaCostsList/teaCostsList?type=2"
				})
			},
			goCostsDetail(id){
				uni.navigateTo({
					url: "/teaBureau/teaCostsDetail/teaCostsDetail?id=" + id
				})
			},
			goPerformanceList(){
				uni.navigateTo({
					url: "/teaBureau/teaPerformance/teaPerformance?type=1"
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.income_box {
		background: #3E4350;
		padding: 20rpx 30rpx;
		border-radius: 20rpx;
	}

	.income_btn {
		background: #E6C77D;
		color: #604504;
		padding: 10rpx 18rpx;
		border-radius: 50rpx;
	}

	.product_price {
		font-size: 40rpx;
		font-weight: bold;
		margin-left: 5rpx;
	}

	.product_tag {
		height: 56rpx;
		line-height: 56rpx;
		color: #fff;
		padding: 0 30rpx;
		font-size: 26rpx;
		border-radius: 50rpx;
	}
	
	.record_box{
		
		.record_title{
			display: flex;
			justify-content: space-between;
			background: #B3723E;
			color: #fff;
			padding: 15rpx 20rpx 30rpx 20rpx;
			border-top-right-radius: 20rpx;
			border-top-left-radius: 20rpx;
			font-size: 26rpx;
		}
		
		.record_content{
			margin-top: -10rpx;
			padding: 20rpx 30rpx;
			display: flex;
			border-radius: 20rpx;
			border: 1rpx solid #fff;
			background: linear-gradient(to bottom, #FBECE2, #FFFEFD);
		}
		
		.record_price{
			font-size: 48rpx;
			font-weight: bold;
			margin-top: 5rpx;
		}
		
		.record_line{
			border: 1rpx solid #EFE5DE;
			border-width: 0 4rpx 0 0;
		}
	}
	
</style>